<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>低价租赁</title>
    <link rel="stylesheet" href="<%=basePath%>css/common_new.min.css">
    <link rel="stylesheet" href="<%=basePath%>static/css/owl.carousel.min.css">
    <link rel="stylesheet" href="<%=basePath%>css/zupin01.css">
    <script src="<%=basePath%>static/js/jquery.min.js"></script>
    <script src="<%=basePath%>static/js/owl.carousel.js"></script>
    
    <script rel="script" src="<%=basePath%>js/vue.min.js"></script>
	<link rel="stylesheet"
		href="//at.alicdn.com/t/font_699355_5fafq7zsd2fq1tt9.css">
	<link rel="stylesheet" href="<%=basePath%>css/index.css">
	<script type="text/javascript" src="<%=basePath%>js/kefu.js"></script>
</head>
<style type="text/css">


.select_btn{
    color:#fff !important;
    width: 100px !important;
	height: 40px !important;
	border-radius: 5px !important;
	background: #ff6f00 !important;
	margin-left: 10px !important;
	margin-top: 20px !important;
	text-align: center !important;
	line-height: 40px !important;
	display:inline-block;
}
</style>
<body>
    <!-- 顶部导航栏 -->
    <section>
        <div id="header">

            <div class="navbar">
	            <div class="navbar-content">
	               <jsp:include page="yeah-top.jsp" />
	            </div>
            </div>
            <div class="daohang">
                <a href="<%=basePath%>">首页</a>
                <span>></span>
                <a href="#">低价租赁</a>
            </div>
        </div>


    </section>
    <!-- 轮播图 -->
	<div class="waper">
		<jsp:include page="yeah_slider_djzl.jsp" />
	</div>
    <!-- 主体 -->
    <section class="zupin">
        <p>选择一款租赁套餐</p>
        <div>
        <c:forEach items="${item }" var="item" >
        	<div class="zulin">
                <div class="zupin1 yinying">
                    <p>${item.combo_name }</p>
                    <img src="${item.img }" style="width: 150px; height: 115px;">
                    <div class="xinghao">
                        <p>品牌
                            <span>${item.brand }</span>
                        </p>
                        <p>CPU
                            <span>${item.cpu }</span>
                        </p>
                        <p>内存
                            <span>${item.neicuen }</span>
                        </p>
                        <p>显卡
                            <span>${item.xianka }</span>
                        </p>
                        <p>硬盘
                            <span>${item.yingpan }</span>
                        </p>
                        <div class="zujia">
                            <div class="zujia1">
                                <span>租价</span>
                            </div>
                            <div class="zujia2">
                                <div>
                                    <p>
                                        <span>￥${item.oneday*item.zheko }/天</span>
                                        <span class="shanchu">原价￥${item.oneday }/天</span>
                                    </p>
                                    <p>（不足一个月）</p>
                                </div>
                                <div>
                                    <p>
                                        <span>￥${item.onemonth*item.zheko }/天</span>
                                        <span class="shanchu">原价￥${item.onemonth }/天</span>
                                    </p>
                                    <p>（不足三个月）</p>
                                </div>
                                <div>
                                    <p>
                                        <span>￥${item.threemonth*item.zheko }/天</span>
                                        <span class="shanchu">原价￥${item.threemonth }/天</span>
                                    </p>
                                    <p>（超过三个月）</p>
                                </div>
                            </div>

                        </div>
                        <p class="yajin">押金
                            <span>￥${item.yajin }</span>
                            
                        </p>
                    </div>
                </div>
                  <a class="select_btn" href="zulinxq?rid=${item.rid }">选择</a>
            </div>
        </c:forEach>
        
            <div class="zulin">
                <div class="zupin1 yinying">
                    <p>套餐四</p>
                    <p style="margin-top: 50px;">自定义套餐</p>
                    <div class="xinghao inp" style="margin-top: 80px;">
                        <p>品牌
                            <input type="text" id="brand">
                        </p>
                        <p>CPU
                            <input type="text" id="cpu">
                        </p>
                        <p>内存
                            <input type="text" id="neicuen">
                        </p>
                        <p>显卡
                            <input type="text" id="xianka">
                        </p>
                        <p>硬盘
                            <input type="text" id="yingpan">
                        </p>
                    </div>
                    <div style="margin-top: 50px;">
                        <p>自定义套餐请联系在线客服</p>
                        <p>
                            <a href="#" style="color: #ff7b24">与客服聊天</a>
                        </p>
                    </div>
                </div>
                <a class="select_btn"  onclick="tij()">提交</a>
            </div>
        </div>
    </section>

    <!-- 底部 -->
    <section>
        <jsp:include page="bottom.jsp" />
    </section>
</body>
<script type="text/javascript" src="<%=basePath%>static/layer/2.4/layer.js"></script>
<script type="text/javascript">
	var a = $(".zulin").length ;
	var c = $(".zulin").height() ;
	var b = parseInt(a/4) ;
	if(b>0){
		 $(".zupin").height(c*(b+1)+80);
	};
	
	function tij(){
		var brand = $("#brand").val();
		var cpu = $("#cpu").val();
		var neicuen = $("#neicuen").val();
		var xianka = $("#xianka").val();
		var yingpan = $("#yingpan").val();
		$.post("tij",
			{brand:brand,
			cpu:cpu,
			neicuen:neicuen,
			xianka:xianka,
			yingpan:yingpan},
			function(data){
				if(data.fale){
					layer.msg("提交成功",{icon:1});
				}else{
					layer.confirm(data.msg,{ btn: ["去登录","取消"] },function(index){
						layer.close(index);
					 	window.location.href = "user" ;
					 });
				}	
					
		},"json");
	};

</script>
</html>